<template>
  <div class="panel_left" v-show="panelShow" ref="panel_left">
    <CellGroup>
      <span @click="showChange('content')">
        <Cell title="内容管理"/>
      </span>

      <span @click="showChange('push')">
        <Cell title="markdown编辑器"/>
      </span>

      <span @click="showChange('navTops')">
        <Cell title="头部导航"/>
      </span>

      <span @click="showChange('count')">
        <Cell title="文章列表数量"/>
      </span>
      <span @click="showChange('icp')">
        <Cell title="ICP信息"/>
      </span>
      <span @click="showChange('title')">
        <Cell title="博客名称修改"/>
      </span>
      <span @click="showChange('push')">
        <Cell title="验证码推送地址"/>
      </span>

      <Cell title="-----------------------------"/>

      <Cell title="返回博客" to="/"/>
    </CellGroup>
  </div>
</template>

<script>
export default {
  data() {
    return {}
  },
  props: ['showChange', 'panelShow'],
  mounted() {
    this.$refs.panel_left.style.height = `${document.documentElement
      .clientHeight - document.querySelector('.header').offsetHeight}px`
  }
}
</script>

<style lang="less" rel="stylesheet/less" scoped>
.panel_left {
  width: 200px;
  background-color: #fff;
}
</style>
